{% extends 'base.html' %}

{% block title %}忘记密码 - Django RBAC 项目{% endblock %}

{% block content %}
<div class="min-h-screen bg-gray-50 flex flex-col justify-center py-12 sm:px-6 lg:px-8">
    <div class="sm:mx-auto sm:w-full sm:max-w-md">
        <h2 class="mt-6 text-center text-3xl font-extrabold text-gray-900">
            忘记密码
        </h2>
        <p class="mt-2 text-center text-sm text-gray-600">
            请输入您的注册邮箱，我们将向您发送密码重置链接
        </p>
    </div>

    <div class="mt-8 sm:mx-auto sm:w-full sm:max-w-md">
        <div class="bg-white py-8 px-4 shadow sm:rounded-lg sm:px-10">
            <form class="space-y-6" method="POST">
                {% csrf_token %}
                {% if messages %}
                    {% for message in messages %}
                        <div class="rounded-md {% if message.tags == 'success' %}bg-green-50{% else %}bg-red-50{% endif %} p-4">
                            <div class="flex">
                                <div class="flex-shrink-0">
                                    {% if message.tags == 'success' %}
                                        <svg class="h-5 w-5 text-green-400" fill="none" stroke="currentColor" viewBox="0 0 24 24">
                                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7"/>
                                        </svg>
                                    {% else %}
                                        <svg class="h-5 w-5 text-red-400" fill="none" stroke="currentColor" viewBox="0 0 24 24">
                                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M6 18L18 6M6 6l12 12"/>
                                        </svg>
                                    {% endif %}
                                </div>
                                <div class="ml-3">
                                    <p class="text-sm font-medium {% if message.tags == 'success' %}text-green-800{% else %}text-red-800{% endif %}">
                                        {{ message }}
                                    </p>
                                </div>
                            </div>
                        </div>
                    {% endfor %}
                {% endif %}

                <div>
                    <label for="{{ form.email.id_for_label }}" class="block text-sm font-medium text-gray-700">
                        电子邮箱
                    </label>
                    <div class="mt-1">
                        {{ form.email }}
                        {% if form.email.errors %}
                            {% for error in form.email.errors %}
                                <p class="mt-2 text-sm text-red-600">{{ error }}</p>
                            {% endfor %}
                        {% endif %}
                    </div>
                </div>

                <div>
                    <button type="submit" class="w-full flex justify-center py-2 px-4 border border-transparent rounded-md shadow-sm text-sm font-medium text-white bg-blue-600 hover:bg-blue-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-blue-500">
                        发送重置链接
                    </button>
                </div>

                <div class="text-sm text-center">
                    <a href="{% url 'login' %}" class="font-medium text-blue-600 hover:text-blue-500">
                        返回登录
                    </a>
                </div>
            </form>
        </div>
    </div>
</div>
{% endblock %}

